<template>
  <a-modal
    :visible="visible"
    title="成绩单"
    :width="900"
    :bodyStyle="{
      height: '500px',
      overflow: 'auto'
    }"
    @cancel="() => { $emit('cancel') }"
  >
    <detail-list :col="4">
      <detail-list-item term="学号">{{ detail.studentInfo.xh }}</detail-list-item>
      <detail-list-item term="姓名">{{ detail.studentInfo.xm }}</detail-list-item>
      <detail-list-item term="院系">{{ detail.studentInfo.dwmc || detail.studentInfo.ssyxmc}}</detail-list-item>
      <detail-list-item term="专业">{{ detail.studentInfo.zymc || detail.studentInfo.sszymc}}</detail-list-item>
      <template v-if="isCredit">
        <detail-list-item term="所在年级">{{ detail.studentInfo.sznjmc }}</detail-list-item>
        <detail-list-item term="学生类别">{{ detail.studentInfo.xslbmc }}</detail-list-item>
      </template>
    </detail-list>

    <detail-list v-if="isCredit" :col="2" style="width: 70%;margin: 20px auto;padding: 20px;border: 1px solid #ccc">
      <detail-list-item term="此学生计划总学分">{{ detail.studentInfo.jhzxf }}&nbsp;</detail-list-item>
      <detail-list-item term="此学生已修学分为">{{ detail.studentInfo.yxzxf }}&nbsp;</detail-list-item>
      <detail-list-item term="必修课门数">{{ detail.studentInfo.jhbxkms }}&nbsp;</detail-list-item>
      <detail-list-item term="已修必修课门数">{{ detail.studentInfo.yxbxkms }}&nbsp;</detail-list-item>
      <detail-list-item term="必修课学分">{{ detail.studentInfo.jhbxkxf }}&nbsp;</detail-list-item>
      <detail-list-item term="已修必修课学分">{{ detail.studentInfo.yxbxkxf }}&nbsp;</detail-list-item>
      <detail-list-item term="学位课门数">{{ detail.studentInfo.jhxwkms }}&nbsp;</detail-list-item>
      <detail-list-item term="已修学位课门数">{{ detail.studentInfo.yxxwkms }}&nbsp;</detail-list-item>
      <detail-list-item term="学位课学分">{{ detail.studentInfo.jhxwkxf }}&nbsp;</detail-list-item>
      <detail-list-item term="已修学位课学分">{{ detail.studentInfo.yxxwkxf }}&nbsp;</detail-list-item>
      <detail-list-item term="选修课门数">{{ detail.studentInfo.jhxxkms }}&nbsp;</detail-list-item>
      <detail-list-item term="已修选修课门数">{{ detail.studentInfo.yxxxkms }}&nbsp;</detail-list-item>
      <detail-list-item term="选修课学分">{{ detail.studentInfo.jhxxkxf }}&nbsp;</detail-list-item>
      <detail-list-item term="已修选修课学分">{{ detail.studentInfo.yxxxkxf }}&nbsp;</detail-list-item>
    </detail-list>
    <a-table
      v-if="!isCredit"
      ref="table"
      size="default"
      rowKey="key"
      :columns="columns"
      :dataSource="detail.pyjhkcList"
      :pagination="false"
    >
      <span slot="serial" slot-scope="text, record, index">
        {{ index + 1 }}
      </span>
      <span slot="xf" slot-scope="text">
        {{ (+text).toFixed(1) }}
      </span>
      
    </a-table>
    <p v-if="!isCredit">你目前共修了{{ detail.yxkcs }}个课程学分，平均绩点（GPA）为{{ detail.pjjd }}</p>
    <div slot="footer">
      <a-button v-if="!isCredit" @click="exportPrint(0)" type="primary">打印中文成绩单</a-button>
      <a-button v-if="!isCredit" @click="exportPrint(1)" type="primary">打印英文成绩单</a-button>
      <a-button @click="() => { $emit('cancel') }">关闭</a-button>
    </div>
  </a-modal>
</template>

<script>
import DetailList from '~/tool/DetailList'
const DetailListItem = DetailList.Item

export default {
  props: ['visible', 'isCredit'],
  components: {DetailList, DetailListItem},
  data () {
    return {
      detail: {
        studentInfo: {},
        pyjhkcList: []
      },
      columns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' }
        },
        {
          title: '课程名称',
          dataIndex: 'kcmc'
        },
        {
          title: '学分',
          dataIndex: 'xf',
          scopedSlots: { customRender: 'xf' }
        },
        {
          title: '成绩',
          dataIndex: 'kscj'
        },
        {
          title: '所属专业',
          dataIndex: 'sszymc'
        },
        {
          title: '修课状态',
          dataIndex: 'xkztmc'
        }
      ]
    }
  },
  watch:{
    visible(value){
      if(!value){
        this.detail.studentInfo = {}
        this.detail.pyjhkcList = {}
      }
    }
  },
  methods: {
    exportPrint(en) {
      let api = en ? '/foster/kccj/xscjywPrint' : '/foster/kccj/xscjPrint'
      this.$downloadPdf(api, { xh: this.detail.studentInfo.xh}, this.detail.studentInfo.xh + '_' + this.detail.studentInfo.xm + '成绩单.pdf')
    }
  }
}
</script>

<style>

</style>
